<script setup lang="ts">
import { ref, onMounted, nextTick } from "vue";
import zhCn from "element-plus/es/locale/lang/zh-cn";
import { ElMessage } from "element-plus";
import { optionsQushi } from "./";
import {
  getCurrentTime,
  formatDate,
  divideElementsFromIndex,
  getTimeRange,
  convertTimeRangeToUTC,
  getPreviousHour,
  getPreviousDay,
  processSensorData,
} from "@/utils/utils.ts";
const locale = zhCn;
import { getGuiListApi, searchApi, getCableRoomDataApi } from "../home/index"; 
import UPlotChart from "@/components/UPlotChart.vue";
import { format } from "date-fns";

import MultiSelect from "@/components/MultiSelect.vue"; // 导入 MultiSelect 下拉框组件


// 获取变电柜数据
const options2 = ref([]);
const gui_value = ref([]);

// 趋势类型
const qushi_value = ref([]);

const parmsObj = ref({
  startTime: "",
  endTime: "",
  gNameIp: [],
  power: [],
});
const guiCheng = (_value: any) => {
  const result = options2.value.filter((item) => gui_value.value.includes(item.id));
  parmsObj.value.gNameIp = result;
};

// 趋势类型选中值发生变化时触发
const qushiCheng = (_value: any) => {
  const result = optionsQushi.value.filter((item) => qushi_value.value.includes(item.id));
  parmsObj.value.power = result;
};

// 时间选择
const valueTime = ref("");
const valueTimelast = ref("");
const timeList = ref([
  {
    name: "1H",
  },
  {
    name: "1D",
  },
  {
    name: "1Mon",
  },
  {
    name: "1Y",
  },
]);
// 上一个时间 选择事件
const timeIndex = ref(null);
const isHours = ref(false);
const shiClick = (index: any) => {
  if (gui_value.value.length == 0) return ElMessage.error("请选择变电柜");
  if (qushi_value.value.length == 0) return ElMessage.error("请选择趋势类型");
  valueTime.value = "";
  // 暂时
  // if (valueTime.value == '' || valueTime.value == null) return ElMessage.error('请选择时间')
  timeIndex.value = index;
  const timeRanges = getTimeRange(getCurrentTime());

  if (index == 0) {
    isHours.value = true;
    valueTimelast.value = convertTimeRangeToUTC(timeRanges.hour);
  } else {
    isHours.value = false;
  }
  if (index == 1) {
    valueTimelast.value = convertTimeRangeToUTC(timeRanges.day);
  }
  if (index == 2) {
    valueTimelast.value = convertTimeRangeToUTC(timeRanges.month);
  }
  if (index == 3) {
    valueTimelast.value = convertTimeRangeToUTC(timeRanges.year);
  }
  const newTime2 = valueTimelast.value.map((res: string) => {
    return formatDate(res);
  });
  parmsObj.value.startTime =
    index == 0 ? getPreviousHour(newTime2[1]) : newTime2[0];
  parmsObj.value.endTime = newTime2[1];

  fetchDataAndProcess(parmsObj.value);
};


// 温度和湿度数据组合
function transformData(originalData: any[]) {
  let result = [];
  let idCounter = 64;
  // let idCounter = optionsQushi.value.length + 1;
  for (const item of originalData) {
    // 添加温度条目
    result.push({
      id: idCounter++,
      deviceId: item.deviceId,
      name: `${item.roomName}-环境温度`,
      type: "wen_du",
      tableName: "TemhumArr"
    });

    // 添加湿度条目 
    result.push({
      id: idCounter++,
      deviceId: item.deviceId, 
      name: `${item.roomName}-环境湿度`,
      type: "shi_du",
      tableName: "TemhumArr"
    });
  }
  return result;
}


// 获取电缆室等数据 然后加到数组后面
const getCableRoomData = async () => {
  const data = await getCableRoomDataApi();
  const transformedData = transformData(data);
  // 合并并去重（假设数据有 id 字段）
  const mergedData = [...optionsQushi.value, ...transformedData];
  const uniqueData = mergedData.filter(
    (item, index, self) => index === self.findIndex((t) => t.id === item.id)
  );
  optionsQushi.value = uniqueData; // 直接赋值，确保数据唯一
};

// 折线图功能dom元素
const aDianLiu = ref(null);
const bDianLiu = ref(null);
const cDianLiu = ref(null);
const dianyaUabRef = ref(null);
const dianyaUbcRef = ref(null);
const dianyaUcaRef = ref(null);
const dianyaUaRef = ref(null);
const dianyaUbRef = ref(null);
const dianyaUcRef = ref(null);
const refsPowerAll = ref(null);
const refsPowerA = ref(null);
const refsPowerB = ref(null);
const refsPowerC = ref(null);
const refsPPowerAll = ref(null);
const refsPPowerA = ref(null);
const refsPPowerB = ref(null);
const refsPPowerC = ref(null);
const refsQPowerAll = ref(null);
const refsQPowerA = ref(null);
const refsQPowerB = ref(null);
const refsQPowerC = ref(null);
const refsCosphiA = ref(null);
const refsCosphiB = ref(null);
const refsCosphiC = ref(null);
const refsQDemandA = ref(null);
const refsQDemandB = ref(null);
const refsQDemandC = ref(null);
const refsSEDegree = ref(null);
const refsPEDegree = ref(null);
const refsQEDegree = ref(null);
const refsTHDVa = ref(null);
const refsTHDVb = ref(null);
const refsTHDVc = ref(null);
const refsTHDIa = ref(null);
const refsTHDIb = ref(null);
const refsTHDIc = ref(null);

// 烟气0.3-10
const refsdianlansmoke3 = ref(null) //电缆室烟气（0.3）数据dom
const refsmuxiansmoke3 = ref(null) //母线室烟气（0.3）数据dom
const refsduanluqismoke3 = ref(null) //断路器室烟气（0.3）数据dom
const refsdianlansmoke5 = ref(null) //电缆室烟气（0.5）数据dom
const refsmuxiansmoke5 = ref(null) //母线室烟气（0.5）数据dom
const refsduanluqismoke5 = ref(null) //断路器室烟气（0.5）数据dom
const refsdianlansmoke10 = ref(null) //电缆室烟气（1）数据dom
const refsmuxiansmoke10 = ref(null) //母线室烟气（1）数据dom
const refsduanluqismoke10 = ref(null) //断路器室烟气（1）数据dom
const refsdianlansmoke25 = ref(null) //电缆室烟气（2.5）数据dom
const refsmuxiansmoke25 = ref(null) //母线室烟气（2.5）数据dom
const refsduanluqismoke25 = ref(null) //断路器室烟气（2.5）数据dom
const refsdianlansmoke50 = ref(null) //电缆室烟气（5）数据dom
const refsmuxiansmoke50 = ref(null) //母线室烟气（5）数据dom
const refsduanluqismoke50 = ref(null) //断路器室烟气（5）数据dom
const refsdianlansmoke100 = ref(null) //电缆室烟气（10）数据dom
const refsmuxiansmoke100 = ref(null) //母线室烟气（10）数据dom
const refsduanluqismoke100 = ref(null) //断路器室烟气（10）数据dom
const refsdianlanshihuguang = ref(null) //电缆室弧光（紫外线）数据dom
const refsmuxianshihuguang = ref(null) //母线室弧光（紫外线）数据dom
const refsduanluqihuguang = ref(null) //电缆室弧光（紫外线）数据dom
const refsdianlanjufang = ref(null)  // 断路器室局放（超声波）数据dom
const refsmuxianjufang = ref(null)  // 母线室局放（超声波）数据dom
const refsduanluqijufang = ref(null)  // 断路器室局放（超声波）数据dom
const refsdianlanMaxTemp = ref(null) // 电缆室红外光最大温度dom
const refsmuxianMaxTemp = ref(null) // 母线室红外光最大温度dom
const refsduanluqiMaxTemp = ref(null) // 断路器室红外光最大温度dom
const refswen_du = ref(null); //电缆室温度dom
const refsshi_du = ref(null)  //电缆室温度dom
const refsmuxianwen_du = ref(null);// 母线室温度dom
const refsmuxianshi_du = ref(null);// 母线室温度dom
const refsduanluwen_du = ref(null);// 断路器室温度dom
const refsduanlushi_du = ref(null);// 断路器室温度dom


// 图表的数据
const dataArra = ref(null);
const dataArrb = ref(null);
const dataArrc = ref(null);
const dataArrUab = ref(null);
const dataArrUbc = ref(null);
const dataArrUca = ref(null);
const dataArrUa = ref(null);
const dataArrUb = ref(null);
const dataArrUc = ref(null);
const dataArrPowerAll = ref(null);
const dataArrsPowerA = ref(null);
const dataArrsPowerB = ref(null);
const dataArrsPowerC = ref(null);
const dataArrPPowerAll = ref(null);
const dataArrPPowerA = ref(null);
const dataArrPPowerB = ref(null);
const dataArrPPowerC = ref(null);
const dataArrQPowerAll = ref(null);
const dataArrQPowerA = ref(null);
const dataArrQPowerB = ref(null);
const dataArrQPowerC = ref(null);
const dataArrCosphiA = ref(null);
const dataArrCosphiB = ref(null);
const dataArrCosphiC = ref(null);
const dataArrQDemandA = ref(null);
const dataArrQDemandB = ref(null);
const dataArrQDemandC = ref(null);
const dataArrSEDegree = ref(null);
const dataArrPEDegree = ref(null);
const dataArrQEDegree = ref(null);
const dataArrTHDVa = ref(null);
const dataArrTHDVb = ref(null);
const dataArrTHDVc = ref(null);
const dataArrTHDIa = ref(null);
const dataArrTHDIb = ref(null);
const dataArrTHDIc = ref(null);

// 烟气0.3-10
const dianlanArrsmoke3 = ref(null); // 电缆室烟气（0.3）的数据
const muxianArrsmoke3 = ref(null); // 母线室烟气（0.3）的数据
const duanluqiArrsmoke3 = ref(null); // 断路器室烟气（0.3）的数据
const dianlanArrsmoke5 = ref(null); // 电缆室烟气（0.5）的数据
const muxianArrsmoke5 = ref(null); // 母线室烟气（0.5）的数据
const duanluqiArrsmoke5 = ref(null); // 断路器室烟气（0.5）的数据
const dianlanArrsmoke10 = ref(null); // 电缆室烟气（1）的数据
const muxianArrsmoke10 = ref(null); // 母线室烟气（1）的数据
const duanluqiArrsmoke10 = ref(null); // 断路器室烟气（1）的数据
const dianlanArrsmoke25 = ref(null); // 电缆室烟气（2.5）的数据
const muxianArrsmoke25 = ref(null); // 母线室烟气（2.5）的数据
const duanluqiArrsmoke25 = ref(null); // 断路器室烟气（2.5）的数据
const dianlanArrsmoke50 = ref(null); // 电缆室烟气（5）的数据
const muxianArrsmoke50 = ref(null); // 母线室烟气（5）的数据
const duanluqiArrsmoke50 = ref(null); // 断路器室烟气（5）的数据
const dianlanArrsmoke100 = ref(null); // 电缆室烟气（10）的数据
const muxianArrsmoke100 = ref(null); // 母线室烟气（10）的数据
const duanluqiArrsmoke100 = ref(null); // 断路器室烟气（10）的数据

const dianlanArrhuguang = ref(null); // 电缆室弧光（紫外线）的数据
const muxianArrhuguang = ref(null); // 母线弧光（紫外线）的数据
const duanluqiArrhuguang = ref(null); // 断路器室弧光（紫外线）的数据
const dianlanArrjufang = ref(null); // 电缆室局放（超声波）的数据
const muxianArrjufang = ref(null); // 母线局放（超声波）的数据
const duanluqiArrjufang = ref(null); // 断路器室局放（超声波）的数据
const dianlanmaxArrwen_du = ref(null); // 电缆室红外光最大温度数据
const muxianmaxArrwen_du = ref(null); // 母线室红外光最大温度数据
const duanluqimaxArrwen_du = ref(null); // 断路器室红外光最大温度数据
const dataArrwen_du = ref(null); // 电缆室温度数据
const dataArrshi_du = ref(null); // 电缆室温度数据
const muxianArrwen_du = ref(null);// 母线室温度数据
const muxianArrshi_du = ref(null);// 母线室温度数据
const duanluArrwen_du = ref(null);// 断路器室温度数据
const duanluArrshi_du = ref(null);// 断路器室温度数据
const strokes = [
  "#f9e232",
  "blue",
  "green",
  "red",
  "pink",
  "brown",
  "gray",
  "teal",
  "lime",
  "purple",
  "orange",
  "cyan",
  "magenta",
  "yellow",
  "olive",
  "navy",
  "maroon",
  "aqua",
  "silver",
  "gold",
  "indigo",
  "violet",
  "beige",
  "coral",
  "khaki",
  "plum",
  "salmon",
  "tan",
  "thistle",
  "turquoise",
  "wheat",
  "saddlebrown",
  "darkgreen",
  "darkblue",
  "darkred",
  "darkcyan",
  "darkmagenta",
  "darkorange",
  "darkgray",
  "darkolive",
  "darknavy",
  "darkpurple",
  "darkkhaki"
];
let labels: any = [];
const chartSeries = ref([]);
const chartSeriesb = ref([]);
const chartSeriesc = ref([]);
const chartSeriesUab = ref([]);
const chartSeriesUbc = ref([]);
const chartSeriesUca = ref([]);
const chartSeriesUa = ref([]);
const chartSeriesUb = ref([]);
const chartSeriesUc = ref([]);
const chartSeriesPowerAll = ref([]);
const chartSeriessPowerA = ref([]);
const chartSeriessPowerB = ref([]);
const chartSeriessPowerC = ref([]);
const chartSeriesPPowerAll = ref([]);
const chartSeriesPPowerA = ref([]);
const chartSeriesPPowerB = ref([]);
const chartSeriesPPowerC = ref([]);
const chartSeriesQPowerAll = ref([]);
const chartSeriesQPowerA = ref([]);
const chartSeriesQPowerB = ref([]);
const chartSeriesQPowerC = ref([]);
const chartSeriesCosphiA = ref([]);
const chartSeriesCosphiB = ref([]);
const chartSeriesCosphiC = ref([]);
const chartSeriesQDemandA = ref([]);
const chartSeriesQDemandB = ref([]);
const chartSeriesQDemandC = ref([]);
const chartSeriesSEDegree = ref([]);
const chartSeriesPEDegree = ref([]);
const chartSeriesQEDegree = ref([]);
const chartSeriesTHDVa = ref([]);
const chartSeriesTHDVb = ref([]);
const chartSeriesTHDVc = ref([]);
const chartSeriesTHDIa = ref([]);
const chartSeriesTHDIb = ref([]);
const chartSeriesTHDIc = ref([]);
// 烟气0.3-10
const chartSeriesdianlansmoke3 = ref([]); // 电缆室烟气（0.3）数据
const chartSeriesmuxiansmoke3 = ref([]); // 母线室烟气（0.3）数据
const chartSeriesduanluqismoke3 = ref([]); // 断路器室烟气（0.3）数据
const chartSeriesdianlansmoke5 = ref([]); // 电缆室烟气（0.5）数据
const chartSeriesmuxiansmoke5 = ref([]); // 母线室烟气（0.5）数据
const chartSeriesduanluqismoke5 = ref([]); // 断路器室烟气（0.5）数据
const chartSeriesdianlansmoke10 = ref([]); // 电缆室烟气（1）数据
const chartSeriesmuxiansmoke10 = ref([]); // 母线室烟气（1）数据
const chartSeriesduanluqismoke10 = ref([]); // 断路器室烟气（1）数据
const chartSeriesdianlansmoke25 = ref([]); // 电缆室烟气（2.5）数据
const chartSeriesmuxiansmoke25 = ref([]); // 母线室烟气（2.5）数据
const chartSeriesduanluqismoke25 = ref([]); // 断路器室烟气（2.5）数据
const chartSeriesdianlansmoke50 = ref([]); // 电缆室烟气（5）数据
const chartSeriesmuxiansmoke50 = ref([]); // 母线室烟气（5）数据
const chartSeriesduanluqismoke50 = ref([]); // 断路器室烟气（5）数据
const chartSeriesdianlansmoke100 = ref([]); // 电缆室烟气（10）数据
const chartSeriesmuxiansmoke100 = ref([]); // 母线室烟气（10）数据
const chartSeriesduanluqismoke100 = ref([]); // 断路器室烟气（10）数据
const chartSeriesdianlanhuguang = ref([]); // 电缆室弧光（紫外线）数据
const chartSeriesmuxianhuguang = ref([]); // 母线室弧光（紫外线）数据
const chartSeriesduanluqihuguang = ref([]); // 断路器室弧光（紫外线）数据
const chartSeriesdianlanjufang = ref([]); // 电缆室局放（超声波）数据
const chartSeriesmuxianjufang = ref([]); // 母线室局放（超声波）数据
const chartSeriesduanluqijufang = ref([]); // 断路器室局放（超声波）数据
const chartSeriesdianlanmaxwen_du = ref([]); // 电缆室温度数据
const chartSeriesmuxianmaxwen_du = ref([]); // 母线室温度数据
const chartSeriesduanluqimaxwen_du = ref([]); // 断路器室温度数据
const chartSerieswen_du = ref([]); // 电缆室温度数据
const chartSeriesshi_du = ref([]); // 电缆室温度数据
const chartSeriesmuxianwen_du = ref([]);// 母线室温度数据
const chartSeriesmuxianshi_du = ref([]);// 母线室温度数据
const chartSeriesduanluwen_du = ref([]);// 断路器室温度数据
const chartSeriesduanlushi_du = ref([]);// 断路器室温度数据

// 获取图表的所有数据
const getDianLiu = async (data: any,parmsObjpar: { startTime: string; endTime: string; gNameIp: never[]; power: never[]; }) => {
  try {
    await nextTick();
    // 多台台柜子数据
    // A相电流
    if (aDianLiu.value && data.Ia) {
      const newArr = processSensorData(data.Ia, parmsObjpar);
      labels = newArr[0];
      chartSeries.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      dataArra.value = newArr.slice(1);
    }
    // B相电流
    if (bDianLiu.value && data.Ib) {
      const newArr = processSensorData(data.Ib,parmsObjpar);
      labels = newArr[0];
      chartSeriesb.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      dataArrb.value = newArr.slice(1);
    }
    // C相电流
    if (cDianLiu.value && data.Ic) {
      const newArr = processSensorData(data.Ic);
      labels = newArr[0];
      chartSeriesc.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      dataArrc.value = newArr.slice(1);
    }
    // 线电压Uab
    if (dianyaUabRef.value && data.Uab) {
      const newArr = processSensorData(data.Uab,parmsObjpar);
      labels = newArr[0];
      chartSeriesUab.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));

      dataArrUab.value = divideElementsFromIndex(newArr.slice(1), 1, 1000);
    }
    // 线电压Ubc
    if (dianyaUbcRef.value && data.Ubc) {
      const newArr = processSensorData(data.Ubc);
      labels = newArr[0];
      chartSeriesUbc.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      // dataArrUbc.value = newArr.slice(1);
      dataArrUbc.value = divideElementsFromIndex(newArr.slice(1), 1, 1000);
    }
    // 线电压Uca
    if (dianyaUcaRef.value && data.Uca) {
      const newArr = processSensorData(data.Uca,parmsObjpar);
      labels = newArr[0];
      chartSeriesUca.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      // dataArrUca.value = newArr.slice(1);
      dataArrUca.value = divideElementsFromIndex(newArr.slice(1), 1, 1000);
    }
    // 相电压Ua
    if (dianyaUaRef.value && data.Ua) {
      const newArr = processSensorData(data.Ua,parmsObjpar);
      labels = newArr[0];
      chartSeriesUa.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      // dataArrUa.value = newArr.slice(1);
      dataArrUa.value = divideElementsFromIndex(newArr.slice(1), 1, 1000);
    }
    // 相电压Ub
    if (dianyaUbRef.value && data.Ub) {
      const newArr = processSensorData(data.Ub,parmsObjpar);
      labels = newArr[0];
      chartSeriesUb.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      // dataArrUb.value = newArr.slice(1);
      dataArrUb.value = divideElementsFromIndex(newArr.slice(1), 1, 1000);
    }
    // 相电压Uc
    if (dianyaUcRef.value && data.Uc) {
      const newArr = processSensorData(data.Uc,parmsObjpar);
      labels = newArr[0];
      chartSeriesUc.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      // dataArrUc.value = newArr.slice(1);
      dataArrUc.value = divideElementsFromIndex(newArr.slice(1), 1, 1000);

    }
    // 总视在功率
    if (refsPowerAll.value && data.sPowerAll) {
      const newArr = processSensorData(data.sPowerAll,parmsObjpar);
      labels = newArr[0];
      chartSeriesPowerAll.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      // dataArrPowerAll.value = newArr.slice(1);
      dataArrPowerAll.value = divideElementsFromIndex(newArr.slice(1), 1, 1000);
    }
    // A相视在功率
    if (refsPowerA.value && data.sPowerA) {
      const newArr = processSensorData(data.sPowerA,parmsObjpar);
      labels = newArr[0];
      chartSeriessPowerA.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      // dataArrsPowerA.value = newArr.slice(1);
      dataArrsPowerA.value = divideElementsFromIndex(newArr.slice(1), 1, 1000);

    }
    // B相视在功率
    if (refsPowerB.value && data.sPowerB) {
      const newArr = processSensorData(data.sPowerB,parmsObjpar);
      labels = newArr[0];
      chartSeriessPowerB.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      // dataArrsPowerB.value = newArr.slice(1);
      dataArrsPowerB.value = divideElementsFromIndex(newArr.slice(1), 1, 1000);

    }
    // C相视在功率
    if (refsPowerC.value && data.sPowerC) {
      const newArr = processSensorData(data.sPowerC);
      labels = newArr[0];
      chartSeriessPowerC.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      // dataArrsPowerC.value = newArr.slice(1);
      dataArrsPowerC.value = divideElementsFromIndex(newArr.slice(1), 1, 1000);

    }
    // 总有功功率
    if (refsPPowerAll.value && data.pPowerAll) {
      const newArr = processSensorData(data.pPowerAll,parmsObjpar);
      labels = newArr[0];
      chartSeriesPPowerAll.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      // dataArrPPowerAll.value = newArr.slice(1);
      dataArrPPowerAll.value = divideElementsFromIndex(newArr.slice(1), 1, 1000);

    }
    // A相有功功率
    if (refsPPowerA.value && data.pPowerA) {
      const newArr = processSensorData(data.pPowerA);
      labels = newArr[0];
      chartSeriesPPowerA.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      // dataArrPPowerA.value = newArr.slice(1);
      dataArrPPowerA.value = divideElementsFromIndex(newArr.slice(1), 1, 1000);

    }
    // B相有功功率
    if (refsPPowerB.value && data.pPowerB) {
      const newArr = processSensorData(data.pPowerB,parmsObjpar);
      labels = newArr[0];
      chartSeriesPPowerB.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      // dataArrPPowerB.value = newArr.slice(1);
      dataArrPPowerB.value = divideElementsFromIndex(newArr.slice(1), 1, 1000);
    }
    // C相有功功率
    if (refsPPowerC.value && data.pPowerC) {
      const newArr = processSensorData(data.pPowerC);
      labels = newArr[0];
      chartSeriesPPowerC.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      // dataArrPPowerC.value = newArr.slice(1);
      dataArrPPowerC.value = divideElementsFromIndex(newArr.slice(1), 1, 1000);

    }
    // 总无功功率
    if (refsQPowerAll.value && data.qPowerAll) {
      const newArr = processSensorData(data.qPowerAll,parmsObjpar);
      labels = newArr[0];
      chartSeriesQPowerAll.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      dataArrQPowerAll.value = newArr.slice(1);
    }
    // A相无功功率
    if (refsQPowerA.value && data.qPowerA) {
      const newArr = processSensorData(data.qPowerA);
      labels = newArr[0];
      chartSeriesQPowerA.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      dataArrQPowerA.value = newArr.slice(1);
    }
    // B相无功功率
    if (refsQPowerB.value && data.qPowerB) {
      const newArr = processSensorData(data.qPowerB,parmsObjpar);
      labels = newArr[0];
      chartSeriesQPowerB.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      dataArrQPowerB.value = newArr.slice(1);
    }
    // C相无功功率
    if (refsQPowerC.value && data.qPowerC) {
      const newArr = processSensorData(data.qPowerC,parmsObjpar);
      labels = newArr[0];
      chartSeriesQPowerC.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      dataArrQPowerC.value = newArr.slice(1);
    }
    // A相功率因数
    if (refsCosphiA.value && data.cosphiA) {
      const newArr = processSensorData(data.cosphiA,parmsObjpar);
      labels = newArr[0];
      chartSeriesCosphiA.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      dataArrCosphiA.value = newArr.slice(1);
    }
    // B相功率因数
    if (refsCosphiB.value && data.cosphiB) {
      const newArr = processSensorData(data.cosphiB,parmsObjpar);
      labels = newArr[0];
      chartSeriesCosphiB.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      dataArrCosphiB.value = newArr.slice(1);
    }
    // C相功率因数
    if (refsCosphiC.value && data.cosphiC) {
      const newArr = processSensorData(data.cosphiC,parmsObjpar);
      labels = newArr[0];
      chartSeriesCosphiC.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      dataArrCosphiC.value = newArr.slice(1);
    }
    // A相无功需量
    if (refsQDemandA.value && data.qDemandA) {
      const newArr = processSensorData(data.qDemandA,parmsObjpar);
      labels = newArr[0];
      chartSeriesQDemandA.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      dataArrQDemandA.value = newArr.slice(1);
    }
    // B相无功需量
    if (refsQDemandB.value && data.qDemandB) {
      const newArr = processSensorData(data.qDemandB,parmsObjpar);
      labels = newArr[0];
      chartSeriesQDemandB.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      dataArrQDemandB.value = newArr.slice(1);
    }

    // C相无功需量
    if (refsQDemandC.value && data.qDemandC) {
      const newArr = processSensorData(data.qDemandC,parmsObjpar);
      labels = newArr[0];
      chartSeriesQDemandC.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      dataArrQDemandC.value = newArr.slice(1);
    }
    // 视在电度
    if (refsSEDegree.value && data.sEDegree) {
      const newArr = processSensorData(data.sEDegree,parmsObjpar);
      labels = newArr[0];
      chartSeriesSEDegree.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      dataArrSEDegree.value = newArr.slice(1);
    }
    // 有功电度
    if (refsPEDegree.value && data.pEDegree) {
      const newArr = processSensorData(data.pEDegree,parmsObjpar);
      labels = newArr[0];
      chartSeriesPEDegree.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      dataArrPEDegree.value = newArr.slice(1);
    }
    // 无功电度
    if (refsQEDegree.value && data.qEDegree) {
      const newArr = processSensorData(data.qEDegree,parmsObjpar);
      labels = newArr[0];
      chartSeriesQEDegree.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      dataArrQEDegree.value = newArr.slice(1);
    }
    // A相电压谐波总含量
    if (refsTHDVa.value && data.THDVa) {

      const newArr = processSensorData(data.THDVa,parmsObjpar);
      labels = newArr[0];
      chartSeriesTHDVa.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      dataArrTHDVa.value = newArr.slice(1);
    }
    // B相电压谐波总含量
    if (refsTHDVb.value && data.THDVb) {
      const newArr = processSensorData(data.THDVb,parmsObjpar);
      labels = newArr[0];
      chartSeriesTHDVb.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      dataArrTHDVb.value = newArr.slice(1);
    }
    // C相电压谐波总含量
    if (refsTHDVc.value && data.THDVc) {
      const newArr = processSensorData(data.THDVc,parmsObjpar);
      labels = newArr[0];
      chartSeriesTHDVc.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      dataArrTHDVc.value = newArr.slice(1);
    }
    // A相电流谐波总含量
    if (refsTHDIa.value && data.THDIa) {
      const newArr = processSensorData(data.THDIa,parmsObjpar);
      labels = newArr[0];
      chartSeriesTHDIa.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      dataArrTHDIa.value = newArr.slice(1);
    }
    // B相电流谐波总含量
    if (refsTHDIb.value && data.THDIb) {
      const newArr = processSensorData(data.THDIb,parmsObjpar);
      labels = newArr[0];
      chartSeriesTHDIb.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      dataArrTHDIb.value = newArr.slice(1);
    }
    // C相电流谐波总含量
    if (refsTHDIc.value && data.THDIc) {
      const newArr = processSensorData(data.THDIc,parmsObjpar);
      labels = newArr[0];
      chartSeriesTHDIc.value = labels.map((label: any, index: any) => ({
        label,
        stroke: strokes[index],
      }));
      dataArrTHDIc.value = newArr.slice(1);
    }



    // 局放（超声波数据）
    if (data.value) {
      const dianData = data.value.filter((it: { deviceId: number; }) => it.deviceId === 1);  // 电缆室1 --> 最高温度
      const muxianData = data.value.filter((it: { deviceId: number; }) => it.deviceId === 2); //母线室2 --> 最高温度
      const duanluqiData = data.value.filter((it: { deviceId: number; }) => it.deviceId === 3); //断路器室3 --> 最高温度
      // 电缆室 局放（超声波）
      if (refsdianlanjufang.value) {
        const dividedArray = dianData.map((item: { value: number; }) => ({
          ...item,
          value: item.value
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesdianlanjufang.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        dianlanArrjufang.value = newArr.slice(1);
      }
      // 母线室 局放（超声波）
      if (refsmuxianjufang.value) {
        const dividedArray = muxianData.map((item: { value: number; }) => ({
          ...item,
          value: item.value
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);

        labels = newArr[0];
        chartSeriesmuxianjufang.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        muxianArrjufang.value = newArr.slice(1);
      }
      // 断路器室 局放（超声波） 
      if (refsduanluqijufang.value) {
        const dividedArray = duanluqiData.map((item: { value: number; }) => ({
          ...item,
          value: item.value
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesduanluqijufang.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        duanluqiArrjufang.value = newArr.slice(1);
      }
    }

    // 弧光（紫外线数据）
    if (data.valueziwai) {
      const dianData = data.valueziwai.filter((it: { deviceId: number; }) => it.deviceId === 1);  // 电缆室1 --> 最高温度
      const muxianData = data.valueziwai.filter((it: { deviceId: number; }) => it.deviceId === 2); //母线室2 --> 最高温度
      const duanluqiData = data.valueziwai.filter((it: { deviceId: number; }) => it.deviceId === 3); //断路器室3 --> 最高温度
      // 电缆室 弧光（紫外线）
      if (refsdianlanshihuguang.value) {
        const dividedArray = dianData.map((item: { value: number; }) => ({
          ...item,
          value: item.value
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesdianlanhuguang.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        dianlanArrhuguang.value = newArr.slice(1);
      }
      // 母线室 弧光（紫外线）
      if (refsmuxianshihuguang.value) {
        const dividedArray = muxianData.map((item: { value: number; }) => ({
          ...item,
          value: item.value
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesmuxianhuguang.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        muxianArrhuguang.value = newArr.slice(1);
      }
      // 断路器室 弧光（紫外线） 
      if (refsduanluqihuguang.value) {
        const dividedArray = duanluqiData.map((item: { value: number; }) => ({
          ...item,
          value: item.value
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesduanluqihuguang.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        duanluqiArrhuguang.value = newArr.slice(1);
      }
    }


    // 烟气0.3的数据
    if (data.smoke3) {
      const dianData = data.smoke3.filter((it: { deviceId: number; }) => it.deviceId === 1);  // 电缆室1 --> 烟气0.3
      const muxianData = data.smoke3.filter((it: { deviceId: number; }) => it.deviceId === 2); //母线室2 --> 烟气0.3
      const duanluqiData = data.smoke3.filter((it: { deviceId: number; }) => it.deviceId === 3); //断路器室3 --> 烟气0.3
      // 电缆室 烟气0.3
      if (refsdianlansmoke3.value) {
        const dividedArray = dianData.map((item: { value: number; }) => ({
          ...item,
          value: item.value
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesdianlansmoke3.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        dianlanArrsmoke3.value = newArr.slice(1);
      }
      // 母线室 烟气0.3
      if (refsmuxiansmoke3.value) {
        const dividedArray = muxianData.map((item: { value: number; }) => ({
          ...item,
          value: item.value
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesmuxiansmoke3.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        muxianArrsmoke3.value = newArr.slice(1);
      }
      // 断路器室 烟气0.3
      if (refsduanluqismoke3.value) {
        const dividedArray = duanluqiData.map((item: { value: number; }) => ({
          ...item,
          value: item.value
        }))
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesduanluqismoke3.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        duanluqiArrsmoke3.value = newArr.slice(1);
      }
    }
    // 烟气0.5的数据
    if (data.smoke5) {
      const dianData = data.smoke5.filter((it: { deviceId: number; }) => it.deviceId === 1);  // 电缆室1 --> 烟气0.5
      const muxianData = data.smoke5.filter((it: { deviceId: number; }) => it.deviceId === 2); //母线室2 --> 烟气0.5
      const duanluqiData = data.smoke5.filter((it: { deviceId: number; }) => it.deviceId === 3); //断路器室3 --> 烟气0.5
      // 电缆室 烟气0.5
      if (refsdianlansmoke5.value) {
        const dividedArray = dianData.map((item: { value: number; }) => ({
          ...item,
          value: item.value
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesdianlansmoke5.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        dianlanArrsmoke5.value = newArr.slice(1)
      }
      // 母线室 烟气0.5
      if (refsmuxiansmoke5.value) {
        const dividedArray = muxianData.map((item: { value: number; }) => ({
          ...item,
          value: item.value
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesmuxiansmoke5.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        muxianArrsmoke5.value = newArr.slice(1);
      }
      // 断路器室 烟气0.5
      if (refsduanluqismoke5.value) {
        const dividedArray = duanluqiData.map((item: { value: number; }) => ({
          ...item,
          value: item.value
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesduanluqismoke5.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        duanluqiArrsmoke5.value = newArr.slice(1)
      }
    }
    // 烟气1的数据
    if (data.smoke10) {
      const dianData = data.smoke10.filter((it: { deviceId: number; }) => it.deviceId === 1);  // 电缆室1 --> 烟气1
      const muxianData = data.smoke10.filter((it: { deviceId: number; }) => it.deviceId === 2); //母线室2 --> 烟气1
      const duanluqiData = data.smoke10.filter((it: { deviceId: number; }) => it.deviceId === 3); //断路器室3 --> 烟气1
      // 电缆室 烟气1 
      if (refsdianlansmoke10.value) {
        const dividedArray = dianData.map((item: { value: number; }) => ({
          ...item,
          value: item.value
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesdianlansmoke10.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        dianlanArrsmoke10.value = newArr.slice(1);
      }
      // 母线室 烟气1
      if (refsmuxiansmoke10.value) {
        const dividedArray = muxianData.map((item: { value: number; }) => ({
          ...item,
          value: item.value
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesmuxiansmoke10.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        muxianArrsmoke10.value = newArr.slice(1);
      }
      // 断路器室 烟气1
      if (refsduanluqismoke10.value) {
        const dividedArray = duanluqiData.map((item: { value: number; }) => ({
          ...item,
          value: item.value
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesduanluqismoke10.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        duanluqiArrsmoke10.value = newArr.slice(1);
      }
    }

    // 烟气2.5的数据
    if (data.smoke25) {
      const dianData = data.smoke25.filter((it: { deviceId: number; }) => it.deviceId === 1);  // 电缆室1 --> 烟气2.5
      const muxianData = data.smoke25.filter((it: { deviceId: number; }) => it.deviceId === 2); //母线室2 --> 烟气2.5
      const duanluqiData = data.smoke25.filter((it: { deviceId: number; }) => it.deviceId === 3); //断路器室3 --> 烟气2.5
      // 电缆室 烟气2.5
      if (refsdianlansmoke25.value) {
        const dividedArray = dianData.map((item: { value: number; }) => ({
          ...item,
          value: item.value
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesdianlansmoke25.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }))
        dianlanArrsmoke25.value = newArr.slice(1);
      }
      // 母线室 烟气2.5
      if (refsmuxiansmoke25.value) {
        const dividedArray = muxianData.map((item: { value: number; }) => ({
          ...item,
          value: item.value
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesmuxiansmoke25.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        muxianArrsmoke25.value = newArr.slice(1);
      }
      // 断路器室 烟气2.5
      if (refsduanluqismoke25.value) {
        const dividedArray = duanluqiData.map((item: { value: number; }) => ({
          ...item,
          value: item.value
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesduanluqismoke25.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        duanluqiArrsmoke25.value = newArr.slice(1)
      }
    }
    // 烟气5的数据
    if (data.smoke50) {
      const dianData = data.smoke50.filter((it: { deviceId: number; }) => it.deviceId === 1);  // 电缆室1 --> 烟气5
      const muxianData = data.smoke50.filter((it: { deviceId: number; }) => it.deviceId === 2); //母线室2 --> 烟气5
      const duanluqiData = data.smoke50.filter((it: { deviceId: number; }) => it.deviceId === 3); //断路器室3 --> 烟气5
      // 电缆室 烟气5
      if (refsdianlansmoke50.value) {
        const dividedArray = dianData.map((item: { value: number; }) => ({
          ...item,
          value: item.value
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesdianlansmoke50.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        dianlanArrsmoke50.value = newArr.slice(1);
      }
      // 母线室 烟气5
      if (refsmuxiansmoke50.value) {
        const dividedArray = muxianData.map((item: { value: number; }) => ({
          ...item,
          value: item.value
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesmuxiansmoke50.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        muxianArrsmoke50.value = newArr.slice(1);
      }
      // 断路器室 烟气5
      if (refsduanluqismoke50.value) {
        const dividedArray = duanluqiData.map((item: { value: number; }) => ({
          ...item,
          value: item.value
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesduanluqismoke50.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        duanluqiArrsmoke50.value = newArr.slice(1)
      }
    }
    // 烟气10的数据
    if (data.smoke100) {
      const dianData = data.smoke100.filter((it: { deviceId: number; }) => it.deviceId === 1);  // 电缆室1 --> 烟气10
      const muxianData = data.smoke100.filter((it: { deviceId: number; }) => it.deviceId === 2); //母线室2 --> 烟气10
      const duanluqiData = data.smoke100.filter((it: { deviceId: number; }) => it.deviceId === 3); //断路器室3 --> 烟气10
      // 电缆室 烟气10
      if (refsdianlansmoke100.value) {
        const dividedArray = dianData.map((item: { value: number; }) => ({
          ...item,
          value: item.value
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesdianlansmoke100.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        dianlanArrsmoke100.value = newArr.slice(1);
      }
      // 母线室 烟气10
      if (refsmuxiansmoke100.value) {
        const dividedArray = muxianData.map((item: { value: number; }) => ({
          ...item,
          value: item.value
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesmuxiansmoke100.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        muxianArrsmoke100.value = newArr.slice(1);
      }
      // 断路器室 烟气10
      if (refsduanluqismoke100.value) {
        const dividedArray = duanluqiData.map((item: { value: number; }) => ({
          ...item,
          value: item.value
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesduanluqismoke100.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        duanluqiArrsmoke100.value = newArr.slice(1)
      }
    }


    // 红外光的数据  未完成
    if (data.maxtempvalue) {
      const dianData = data.maxtempvalue.filter((it: { deviceId: number; }) => it.deviceId === 1);  // 电缆室1 --> 最高温度
      const muxianData = data.maxtempvalue.filter((it: { deviceId: number; }) => it.deviceId === 2); //母线室2 --> 最高温度
      const duanluqiData = data.maxtempvalue.filter((it: { deviceId: number; }) => it.deviceId === 3); //断路器室3 --> 最高温度
      // 电缆室 可见光最大温度
      if (refsdianlanMaxTemp.value) {
        const dividedArray = dianData.map((item: { value: number; }) => ({
          ...item,
          value: item.value
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesdianlanmaxwen_du.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        dianlanmaxArrwen_du.value = newArr.slice(1);
      }
      // 母线室 可见光最大温度
      if (refsmuxianMaxTemp.value) {
        const dividedArray = muxianData.map((item: { value: number; }) => ({
          ...item,
          value: item.value
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesmuxianmaxwen_du.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        muxianmaxArrwen_du.value = newArr.slice(1);
      }
      // 断路器室 可见光最大温度 
      if (refsduanluqiMaxTemp.value) {
        const dividedArray = duanluqiData.map((item: { value: number; }) => ({
          ...item,
          value: item.value
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesduanluqimaxwen_du.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        duanluqimaxArrwen_du.value = newArr.slice(1);
      }
    }

    // 温度趋势（电缆室1、母线室2、断路器室3）
    if (data.wen_du) {

      const dianData = data.wen_du.filter((it: { deviceId: number; }) => it.deviceId === 1);  // 电缆室1 --> 温度
      const muxianData = data.wen_du.filter((it: { deviceId: number; }) => it.deviceId === 2); //母线室2 --> 温度
      const duanluqiData = data.wen_du.filter((it: { deviceId: number; }) => it.deviceId === 3); //断路器室3 --> 温度

      // 电缆室 温度
      if (refswen_du.value) {
        const dividedArray = dianData.map((item: { value: number; }) => ({
          ...item,
          value: item.value / 10
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSerieswen_du.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        dataArrwen_du.value = newArr.slice(1);
      }

      // 母线室2 温度
      if (refsmuxianwen_du.value) {
        const dividedArray = muxianData.map((item: { value: number; }) => ({
          ...item,
          value: item.value / 10
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesmuxianwen_du.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        muxianArrwen_du.value = newArr.slice(1);
      }

      // 断路器室3 温度
      if (refsduanluwen_du.value) {
        const dividedArray = duanluqiData.map((item: { value: number; }) => ({
          ...item,
          value: item.value / 10
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesduanluwen_du.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        duanluArrwen_du.value = newArr.slice(1);
      }


      // 源代码
      // const dividedArray = data.wen_du.map((item: { value: number; }) => ({
      //   ...item,
      //   value: item.value / 10
      // }));
      // const newArr = processSensorData(dividedArray);
      // labels = newArr[0];
      // chartSerieswen_du.value = labels.map((label: any, index: any) => ({  
      //   label,
      //   stroke: strokes[index],
      // }));
      // dataArrwen_du.value = newArr.slice(1);
    }

    // 湿度趋势（电缆室1、母线室2、断路器室3）
    if (data.shi_du) {
      const dianData = data.shi_du.filter((it: { deviceId: number; }) => it.deviceId === 1);  // 电缆室1 --> 湿度
      const muxianData = data.shi_du.filter((it: { deviceId: number; }) => it.deviceId === 2); //母线室2 --> 湿度
      const duanluqiData = data.shi_du.filter((it: { deviceId: number; }) => it.deviceId === 3); //断路器室3 --> 湿度
      // 电缆室 湿度
      if (refsshi_du.value) {
        const dividedArray = dianData.map((item: { value: number; }) => ({
          ...item,
          value: item.value / 10
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesshi_du.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        dataArrshi_du.value = newArr.slice(1);
      }

      // 母线室2 湿度
      if (refsmuxianshi_du.value) {
        const dividedArray = muxianData.map((item: { value: number; }) => ({
          ...item,
          value: item.value / 10
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesmuxianshi_du.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        muxianArrshi_du.value = newArr.slice(1);
      }

      // 断路器室3 湿度
      if (refsduanlushi_du.value) {
        const dividedArray = duanluqiData.map((item: { value: number; }) => ({
          ...item,
          value: item.value / 10
        }));
        const newArr = processSensorData(dividedArray,parmsObjpar);
        labels = newArr[0];
        chartSeriesduanlushi_du.value = labels.map((label: any, index: any) => ({
          label,
          stroke: strokes[index],
        }));
        duanluArrshi_du.value = newArr.slice(1);
      }
      // 源代码
      // const dividedArray = data.shi_du.map((item: { value: number; }) => ({
      //   ...item,
      //   value: item.value / 10
      // }));
      // const newArr = processSensorData(dividedArray);
      // labels = newArr[0];
      // chartSeriesshi_du.value = labels.map((label: any, index: any) => ({
      //   label,
      //   stroke: strokes[index],
      // }));
      // dataArrshi_du.value = newArr.slice(1);
    }


  } catch (error) {
    console.error("Error in getDianLiu:", error);
  }
};

// 获取变电柜的数据
const getGuiApi = async () => {
  try {
    const datalist = await getGuiListApi(); // 获取数据
    if (!datalist.length || !datalist) return undefined;
    datalist.forEach((item: any) => {
      item.name = item.ip_name; // 给每个选项设置 label 属性 
    })
    options2.value = datalist;
  } catch (error) {
    console.error("Error in getSpatial:", error);
  }
};

// 假设 `searchApi`, ``, 和 `` 已经是已定义的函数
async function fetchDataAndProcess(parmsObjpar: {
  startTime: string;
  endTime: string;
  gNameIp: never[];
  power: never[];
}) {
  try {
    // 调用 searchApi 获取数据
    const { success, data } = await searchApi(parmsObjpar);

    // 判断是否获取成功
    if (success) {
      // 处理数据
      data.Ia ? (dianliuA.value = true) : (dianliuA.value = false); //A相电流
      data.Ib ? (dianliuB.value = true) : (dianliuB.value = false); //B相电流
      data.Ic ? (dianliuC.value = true) : (dianliuC.value = false); //C相电流
      data.Uab ? (dianyaUab.value = true) : (dianyaUab.value = false); //线电压Uab
      data.Ubc ? (dianyaUbc.value = true) : (dianyaUbc.value = false); //线电压Ubc
      data.Uca ? (dianyaUca.value = true) : (dianyaUca.value = false); //线电压Uca
      data.Ua ? (dianyaUa.value = true) : (dianyaUa.value = false); //相电压Ua
      data.Ub ? (dianyaUb.value = true) : (dianyaUb.value = false); //相电压Ua
      data.Uc ? (dianyaUc.value = true) : (dianyaUc.value = false); //相电压Ua
      data.sPowerAll ? (isSPowerAll.value = true) : (isSPowerAll.value = false); //总视在功率
      data.sPowerA ? (isSPowerA.value = true) : (isSPowerA.value = false); //A相视在功率
      data.sPowerB ? (isSPowerB.value = true) : (isSPowerB.value = false); //B相视在功率
      data.sPowerC ? (isSPowerC.value = true) : (isSPowerC.value = false); //C相视在功率
      data.pPowerAll ? (isPPowerAll.value = true) : (isPPowerAll.value = false); //总有功功率
      data.pPowerA ? (isPPowerA.value = true) : (isPPowerA.value = false); //A相有功功率
      data.pPowerB ? (isPPowerB.value = true) : (isPPowerB.value = false); //B相有功功率
      data.pPowerC ? (isPPowerC.value = true) : (isPPowerC.value = false); //C相有功功率
      data.qPowerAll ? (isQPowerAll.value = true) : (isQPowerAll.value = false); //总无功功率
      data.qPowerA ? (isQPowerA.value = true) : (isQPowerA.value = false); //A相无功功率
      data.qPowerB ? (isQPowerB.value = true) : (isQPowerB.value = false); //B相无功功率
      data.qPowerC ? (isQPowerC.value = true) : (isQPowerC.value = false); //C相无功功率
      data.cosphiA ? (isCosphiA.value = true) : (isCosphiA.value = false); //A相功率因数
      data.cosphiB ? (isCosphiB.value = true) : (isCosphiB.value = false); //B相功率因数
      data.cosphiC ? (isCosphiC.value = true) : (isCosphiC.value = false); //C相功率因数
      data.qDemandA ? (isQDemandA.value = true) : (isQDemandA.value = false); //A相无功需量
      data.qDemandB ? (isQDemandB.value = true) : (isQDemandB.value = false); //B相无功需量
      data.qDemandC ? (isQDemandC.value = true) : (isQDemandC.value = false); //C相无功需量
      data.sEDegree ? (isSEDegree.value = true) : (isSEDegree.value = false); //视在电度
      data.pEDegree ? (isPEDegree.value = true) : (isPEDegree.value = false); //有功电度
      data.qEDegree ? (isQEDegree.value = true) : (isQEDegree.value = false); //无功电度
      data.THDVa ? (isTHDVa.value = true) : (isTHDVa.value = false); //A相电压谐波总含量
      data.THDVb ? (isTHDVb.value = true) : (isTHDVb.value = false); //B相电压谐波总含量
      data.THDVc ? (isTHDVc.value = true) : (isTHDVc.value = false); //C相电压谐波总含量
      data.THDIa ? (isTHDIa.value = true) : (isTHDIa.value = false); //A相电流谐波总含量
      data.THDIb ? (isTHDIb.value = true) : (isTHDIb.value = false); //B相电流谐波总含量
      data.THDIc ? (isTHDIc.value = true) : (isTHDIc.value = false); //C相电流谐波总含量
      // 红外最大温度显示趋势
      if (data.maxtempvalue) {
        const dianData = data.maxtempvalue.filter((it: { deviceId: number; }) => it.deviceId === 1);  // 电缆室1 --> 温度
        const muxianData = data.maxtempvalue.filter((it: { deviceId: number; }) => it.deviceId === 2); //母线室2 --> 温度
        const duanluqiData = data.maxtempvalue.filter((it: { deviceId: number; }) => it.deviceId === 3); //断路器室3 --> 温度
        dianData.length > 0 ? (isdianlanMaxTemp.value = true) : (isdianlanMaxTemp.value = false); //温度趋势 电缆室1
        muxianData.length > 0 ? (ismuxianMaxTemp.value = true) : (ismuxianMaxTemp.value = false); //温度趋势 母线室2
        duanluqiData.length > 0 ? (isduanluqiMaxTemp.value = true) : (isduanluqiMaxTemp.value = false); //温度趋势 断路器室3
      }else{
        isdianlanMaxTemp.value = false; //温度趋势 电缆室1
        ismuxianMaxTemp.value = false; //温度趋势 母线室2
        isduanluqiMaxTemp.value = false; //温度趋势 断路器室3
      }
      // 局放（超声波）显示趋势
      if (data.value) {
        const dianData = data.value.filter((it: { deviceId: number; }) => it.deviceId === 1);  // 电缆室1 --> 局放
        const muxianData = data.value.filter((it: { deviceId: number; }) => it.deviceId === 2); //母线室2 --> 局放
        const duanluqiData = data.value.filter((it: { deviceId: number; }) => it.deviceId === 3); //断路器室3 --> 局放
        dianData.length > 0 ? (isdianlanjufang.value = true) : (isdianlanjufang.value = false); //局放趋势 电缆室1
        muxianData.length > 0 ? (ismuxianjufang.value = true) : (ismuxianjufang.value = false); //局放趋势 母线室2
        duanluqiData.length > 0 ? (isduanluqijufang.value = true) : (isduanluqijufang.value = false); //局放趋势 断路器室3
      }else{
        isdianlanjufang.value = false; //局放趋势 电缆室1
        ismuxianjufang.value = false; //局放趋势 母线室2
        isduanluqijufang.value = false; //局放趋势 断路器室3
      }

      // 弧光（紫外线）显示趋势
      if (data.valueziwai) {
        const dianData = data.valueziwai.filter((it: { deviceId: number; }) => it.deviceId === 1);  // 电缆室1 --> 弧光
        const muxianData = data.valueziwai.filter((it: { deviceId: number; }) => it.deviceId === 2); //母线室2 --> 弧光
        const duanluqiData = data.valueziwai.filter((it: { deviceId: number; }) => it.deviceId === 3); //断路器室3 --> 弧光
        dianData.length > 0 ? (isdianlanhuguang.value = true) : (isdianlanhuguang.value = false); //弧光趋势 电缆室1
        muxianData.length > 0 ? (ismuxianhuguang.value = true) : (ismuxianhuguang.value = false); //弧光趋势 母线室2
        duanluqiData.length > 0 ? (isduanluqihuguang.value = true) : (isduanluqihuguang.value = false); //弧光趋势 断路器室3
      }else{
        isdianlanhuguang.value = false; //弧光趋势 电缆室1
        ismuxianhuguang.value = false; //弧光趋势 母线室2
        isduanluqihuguang.value = false; //弧光趋势 断路器室3
      }


      // 烟气0.3
      if (data.smoke3) {
        const dianData = data.smoke3.filter((it: { deviceId: number; }) => it.deviceId === 1);  // 电缆室1 --> 烟气
        const muxianData = data.smoke3.filter((it: { deviceId: number; }) => it.deviceId === 2); //母线室2 --> 烟气
        const duanluqiData = data.smoke3.filter((it: { deviceId: number; }) => it.deviceId === 3); //断路器室3 --> 烟气
        dianData.length > 0 ? (isdianlansmoke3.value = true) : (isdianlansmoke3.value = false); //烟气趋势 电缆室1
        muxianData.length > 0 ? (ismuxiansmoke3.value = true) : (ismuxiansmoke3.value = false); //烟气趋势 母线室2
        duanluqiData.length > 0 ? (isduanluqismoke3.value = true) : (isduanluqismoke3.value = false); //烟气趋势 断路器室3
      } else {
        isdianlansmoke3.value = false; //烟气趋势 电缆室1
        ismuxiansmoke3.value = false; //烟气趋势 母线室2
        isduanluqismoke3.value = false; //烟气趋势 断路器室3
      }
      // 烟气0.5
      if (data.smoke5) {
        const dianData = data.smoke5.filter((it: { deviceId: number; }) => it.deviceId === 1);  // 电缆室1 --> 烟气
        const muxianData = data.smoke5.filter((it: { deviceId: number; }) => it.deviceId === 2); //母线室2 --> 烟气
        const duanluqiData = data.smoke5.filter((it: { deviceId: number; }) => it.deviceId === 3); //断路器室3 --> 烟气
        dianData.length > 0 ? (isdianlansmoke5.value = true) : (isdianlansmoke5.value = false); //烟气趋势 电缆室1
        muxianData.length > 0 ? (ismuxiansmoke5.value = true) : (ismuxiansmoke5.value = false); //烟气趋势 母线室2
        duanluqiData.length > 0 ? (isduanluqismoke5.value = true) : (isduanluqismoke5.value = false); //烟气趋势 断路器室3  
      } else {
        isdianlansmoke5.value = false; //烟气趋势 电缆室1
        ismuxiansmoke5.value = false; //烟气趋势 母线室2
        isduanluqismoke5.value = false; //烟气趋势 断路器室3
      }
      // 烟气1
      if (data.smoke10) {
        const dianData = data.smoke10.filter((it: { deviceId: number; }) => it.deviceId === 1);  // 电缆室1 --> 烟气
        const muxianData = data.smoke10.filter((it: { deviceId: number; }) => it.deviceId === 2); //母线室2 --> 烟气
        const duanluqiData = data.smoke10.filter((it: { deviceId: number; }) => it.deviceId === 3); //断路器室3 --> 烟气
        dianData.length > 0 ? (isdianlansmoke10.value = true) : (isdianlansmoke10.value = false); //烟气趋势 电缆室1
        muxianData.length > 0 ? (ismuxiansmoke10.value = true) : (ismuxiansmoke10.value = false); //烟气趋势 母线室2
        duanluqiData.length > 0 ? (isduanluqismoke10.value = true) : (isduanluqismoke10.value = false); //烟气趋势 断路器室3  
      } else {
        isdianlansmoke10.value = false; //烟气趋势 电缆室1
        ismuxiansmoke10.value = false; //烟气趋势 母线室2
        isduanluqismoke10.value = false; //烟气趋势 断路器室3
      }
      // 烟气2.5
      if (data.smoke25) {
        const dianData = data.smoke25.filter((it: { deviceId: number; }) => it.deviceId === 1);  // 电缆室1 --> 烟气
        const muxianData = data.smoke25.filter((it: { deviceId: number; }) => it.deviceId === 2); //母线室2 --> 烟气
        const duanluqiData = data.smoke25.filter((it: { deviceId: number; }) => it.deviceId === 3); //断路器室3 --> 烟气
        dianData.length > 0 ? (isdianlansmoke25.value = true) : (isdianlansmoke25.value = false); //烟气趋势 电缆室1
        muxianData.length > 0 ? (ismuxiansmoke25.value = true) : (ismuxiansmoke25.value = false); //烟气趋势 母线室2
        duanluqiData.length > 0 ? (isduanluqismoke25.value = true) : (isduanluqismoke25.value = false); //烟气趋势 断路器室3 
      } else {
        isdianlansmoke25.value = false; //烟气趋势 电缆室1
        ismuxiansmoke25.value = false; //烟气趋势 母线室2
        isduanluqismoke25.value = false; //烟气趋势 断路器室3
      }
      // 烟气5
      if (data.smoke50) {
        const dianData = data.smoke50.filter((it: { deviceId: number; }) => it.deviceId === 1);  // 电缆室1 --> 烟气
        const muxianData = data.smoke50.filter((it: { deviceId: number; }) => it.deviceId === 2); //母线室2 --> 烟气
        const duanluqiData = data.smoke50.filter((it: { deviceId: number; }) => it.deviceId === 3); //断路器室3 --> 烟气
        dianData.length > 0 ? (isdianlansmoke50.value = true) : (isdianlansmoke50.value = false); //烟气趋势 电缆室1
        muxianData.length > 0 ? (ismuxiansmoke50.value = true) : (ismuxiansmoke50.value = false); //烟气趋势 母线室2
        duanluqiData.length > 0 ? (isduanluqismoke50.value = true) : (isduanluqismoke50.value = false); //烟气趋势 断路器室3  
      } else {
        isdianlansmoke50.value = false; //烟气趋势 电缆室1
        ismuxiansmoke50.value = false; //烟气趋势 母线室2
        isduanluqismoke50.value = false; //烟气趋势 断路器室3
      }
      // 烟气10
      if (data.smoke100) {
        const dianData = data.smoke100.filter((it: { deviceId: number; }) => it.deviceId === 1);  // 电缆室1 --> 烟气
        const muxianData = data.smoke100.filter((it: { deviceId: number; }) => it.deviceId === 2); //母线室2 --> 烟气
        const duanluqiData = data.smoke100.filter((it: { deviceId: number; }) => it.deviceId === 3); //断路器室3 --> 烟气
        dianData.length > 0 ? (isdianlansmoke100.value = true) : (isdianlansmoke100.value = false); //烟气趋势 电缆室1
        muxianData.length > 0 ? (ismuxiansmoke100.value = true) : (ismuxiansmoke100.value = false); //烟气趋势 母线室2
        duanluqiData.length > 0 ? (isduanluqismoke100.value = true) : (isduanluqismoke100.value = false); //烟气趋势 断路器室3  
      } else {
        isdianlansmoke100.value = false; //烟气趋势 电缆室1
        ismuxiansmoke100.value = false; //烟气趋势 母线室2
        isduanluqismoke100.value = false; //烟气趋势 断路器室3
      }


      // data.wen_du ? (iswen_du.value = true) : (iswen_du.value = false); //温度趋势 电缆室
      // data.shi_du ? (isshi_du.value = true) : (isshi_du.value = false); //温度趋势 电缆室
      if (data.wen_du) {
        const dianData = data.wen_du.filter((it: { deviceId: number; }) => it.deviceId === 1);  // 电缆室1 --> 温度
        const muxianData = data.wen_du.filter((it: { deviceId: number; }) => it.deviceId === 2); //母线室2 --> 温度
        const duanluqiData = data.wen_du.filter((it: { deviceId: number; }) => it.deviceId === 3); //断路器室3 --> 温度
        dianData.length > 0 ? (iswen_du.value = true) : (iswen_du.value = false); //温度趋势 电缆室
        muxianData.length > 0 ? (iswen_dumuxian.value = true) : (iswen_dumuxian.value = false); //温度趋势 母线室2
        duanluqiData.length > 0 ? (iswen_duduanluqi.value = true) : (iswen_duduanluqi.value = false); //温度趋势 断路器室3
      } else {
        iswen_du.value = false; //温度趋势 电缆室
        iswen_dumuxian.value = false; //温度趋势 母线室2
        iswen_duduanluqi.value = false; //温度趋势 断路器室3 
      }
      if (data.shi_du) {
        const dianDatashi = data.shi_du.filter((it: { deviceId: number; }) => it.deviceId === 1);  // 电缆室1 --> 湿度
        const muxianDatashi = data.shi_du.filter((it: { deviceId: number; }) => it.deviceId === 2); //母线室2 --> 湿度
        const duanluqiDatashi = data.shi_du.filter((it: { deviceId: number; }) => it.deviceId === 3); //断路器室3 --> 湿度
        dianDatashi.length > 0 ? (isshi_du.value = true) : (isshi_du.value = false); //湿度趋势 电缆室
        muxianDatashi.length > 0 ? (isshi_dumuxian.value = true) : (isshi_dumuxian.value = false); //湿度趋势 母线室2
        duanluqiDatashi.length > 0 ? (isshi_duduanluqi.value = true) : (isshi_duduanluqi.value = false); //湿度趋势 断路器室3
      } else {
        isshi_du.value = false; //湿度趋势 电缆室
        isshi_dumuxian.value = false; //湿度趋势 母线室2
        isshi_duduanluqi.value = false; //湿度趋势 断路器室3
      }
      // 传递处理后的结果给 getDianLiu
      getDianLiu(data,parmsObjpar);
    } else {
      // 显示错误消息
      ElMessage.error("获取数据失败");
    }
  } catch (error) {
    // 捕获并打印错误
    console.error("Error in getSpatial:", error);
  }
}

// 重置按钮
const CancelOpen = async () => {
  gui_value.value = [];
  qushi_value.value = [];
  valueTime.value = "";
  parmsObj.value = {
    startTime: getPreviousHour(getCurrentTime()),
    endTime: getCurrentTime(),
    gNameIp: [options2.value[0]],
    power: [optionsQushi.value[0]],
  };
  await fetchDataAndProcess(parmsObj.value);
};

// 搜索事件
const ApplyOpen = async () => {
  timeIndex.value = null;
  if (gui_value.value.length == 0) return ElMessage.error("请选择变电柜");
  if (qushi_value.value.length == 0) return ElMessage.error("请选择趋势类型");
  if (valueTime.value == "" || valueTime.value == null)
    return ElMessage.error("请选择时间");
  const newTime = valueTime.value.map((res: string) => {
    return formatDate(res);
  });
  // parmsObj.value.startTime = newTime[0]
  parmsObj.value.startTime =
    newTime[0] == newTime[1] ? getPreviousHour(newTime[1]) : newTime[0];
  parmsObj.value.endTime = newTime[1];
  fetchDataAndProcess(parmsObj.value);
};

// 显示影藏 图表
const dianliuA = ref(true);
const dianliuB = ref(false);
const dianliuC = ref(false);
const dianyaUab = ref(false);
const dianyaUbc = ref(false);
const dianyaUca = ref(false);
const dianyaUa = ref(false);
const dianyaUb = ref(false);
const dianyaUc = ref(false);
const isSPowerAll = ref(false);
const isSPowerA = ref(false);
const isSPowerB = ref(false);
const isSPowerC = ref(false);
const isPPowerAll = ref(false);
const isPPowerA = ref(false);
const isPPowerB = ref(false);
const isPPowerC = ref(false);
const isQPowerAll = ref(false);
const isQPowerA = ref(false);
const isQPowerB = ref(false);
const isQPowerC = ref(false);
const isCosphiA = ref(false);
const isCosphiB = ref(false);
const isCosphiC = ref(false);
const isQDemandA = ref(false);
const isQDemandB = ref(false);
const isQDemandC = ref(false);
const isSEDegree = ref(false);
const isPEDegree = ref(false);
const isQEDegree = ref(false);
const isTHDVa = ref(false);
const isTHDVb = ref(false);
const isTHDVc = ref(false);
const isTHDIa = ref(false);
const isTHDIb = ref(false);
const isTHDIc = ref(false);
// 烟气0.3-10
const isdianlansmoke3 = ref(false); // 电缆室烟气0.3
const ismuxiansmoke3 = ref(false); // 母线室烟气0.3
const isduanluqismoke3 = ref(false); // 断路器室烟气0.3
const isdianlansmoke5 = ref(false); // 电缆室烟气0.5
const ismuxiansmoke5 = ref(false); // 母线室烟气0.5
const isduanluqismoke5 = ref(false); // 断路器室烟气0.5
const isdianlansmoke10 = ref(false); // 电缆室烟气1
const ismuxiansmoke10 = ref(false); // 母线室烟气1
const isduanluqismoke10 = ref(false); // 断路器室烟气1
const isdianlansmoke25 = ref(false); // 电缆室烟气2.5
const ismuxiansmoke25 = ref(false); // 母线室烟气2.5
const isduanluqismoke25 = ref(false); // 断路器室烟气2.5
const isdianlansmoke50 = ref(false); // 电缆室烟气5
const ismuxiansmoke50 = ref(false); // 母线室烟气5
const isduanluqismoke50 = ref(false); // 断路器室烟气5
const isdianlansmoke100 = ref(false); // 电缆室烟气10
const ismuxiansmoke100 = ref(false); // 母线室烟气10
const isduanluqismoke100 = ref(false); // 断路器室烟气10

const isdianlanhuguang = ref(false) // 电缆室弧光（紫外线）的显示影藏
const ismuxianhuguang = ref(false) // 母线室弧光（紫外线）的显示影藏 
const isduanluqihuguang = ref(false) // 断路器室弧光（紫外线）的显示影藏
const isdianlanjufang = ref(false) // 电缆室局放（超声波）的显示影藏
const ismuxianjufang = ref(false) // 母线室局放（超声波）的显示影藏 
const isduanluqijufang = ref(false) // 断路器室局放（超声波）的显示影藏
const isdianlanMaxTemp = ref(false) // 电缆室红外光最大温度的显示影藏
const ismuxianMaxTemp = ref(false) // 母线室红外光最大温度的显示影藏
const isduanluqiMaxTemp = ref(false) // 断路器室红外光最大温度的显示影藏
const iswen_du = ref(false) // 电缆室温度的显示影藏
const isshi_du = ref(false) // 电缆室湿度的显示影藏
const iswen_dumuxian = ref(false)// 母线室温度的显示影藏
const isshi_dumuxian = ref(false)  // 母线室湿度的显示影藏
const iswen_duduanluqi = ref(false)// 断路器室温度的显示影藏
const isshi_duduanluqi = ref(false)  // 断路器室湿度的显示影藏
onMounted(async () => {
  await getGuiApi();
  await getCableRoomData();
  if (options2.value.length == 0 || optionsQushi.value.length == 0) return;
  parmsObj.value = {
    // startTime: getPreviousHour(getCurrentTime()),
    startTime: getPreviousDay(getCurrentTime()),
    endTime: getCurrentTime(),
    gNameIp: [options2.value[0]],
    power: [optionsQushi.value[0]],
  };
  await fetchDataAndProcess(parmsObj.value);
});

</script>
<template>
  <div class="trend">
    <div class="trend-top">
      <!-- 顶部页面数据 -->
      <div class="top-top">
        <div class="top-item">
          <div class="top-title">Cabinet 柜体</div>

          <div style="width: 300px">
            <MultiSelect v-model="gui_value" :options="options2" multiWidth="430px" placeholder="请选择柜号"  :typeNumber="10"
              @change="guiCheng" />

          </div>
        </div>
      </div>
      <!-- 底部页面数据 -->
      <div class="top-bom">
        <!-- 趋势类型 -->
        <div class="top-item">
          <div class="top-title">趋势类型 Trend Type</div>
          <MultiSelect v-model="qushi_value" :options="optionsQushi" multiWidth="430px" placeholder="请选择类型"
            :typeNumber="10" @change="qushiCheng" />

        </div>
        <!-- 起始时间-结束时间 -->
        <div class="top-item" style="width: 500px">
          <div class="top-time-box">
            <div style="width: 200px">起始时间Start Date</div> - <div style="width: 200;margin-left:20px">结束时间End Date</div>
          </div>
          <DatePicker :width="400" v-model="valueTime" format="yyyy-MM-dd" :max-date="format(new Date(), 'yyyy-MM-dd')"
            size="small" range :max-range="7" placeholder="请选择日期范围" />

        </div>

        <!-- 上一个时间 -->
        <div class="top-item">
          <div class="top-title">上一个时间 Last time</div>
          <div class="top-shijian">
            <div class="shi-item" :class="timeIndex == index ? 'timeColor' : ''" v-for="(item, index) in timeList"
              :key="index" @click="shiClick(index)">
              {{ item.name }}
            </div>
          </div>
        </div>
        <!-- Cancel && Apply -->
        <div class="top-item" style="margin-left: 240px">
          <div class="top-time-q"></div>
          <div class="top-button">
            <div class="buttom-item" style="background-color: #303238" @click="CancelOpen">
              Cancel
            </div>
            <div class="buttom-item" style="background-color: #349bfc" @click="ApplyOpen">
              Apply
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="trend-bom">
      <!-- A相电流 -->
      <div class="bom-chat-box" v-if="dianliuA">
        <div class="chat-left">
          <div>A相电流</div>
          <div>Current(A)</div>
        </div>
        <div class="chat-right" ref="aDianLiu">
          <UPlotChart v-if="dataArra" :data="dataArra" :seriesData="chartSeries" />
        </div>
      </div>
      <!-- B相电流 -->
      <div class="bom-chat-box" v-if="dianliuB">
        <div class="chat-left">
          <div>B相电流</div>
          <div>Current(A)</div>
        </div>
        <div class="chat-right" ref="bDianLiu">
          <UPlotChart v-if="dataArrb" :data="dataArrb" :seriesData="chartSeriesb" />
        </div>
      </div>
      <!-- C相电流 -->
      <div class="bom-chat-box" v-if="dianliuC">
        <div class="chat-left">
          <div>C相电流</div>
          <div>Current(A)</div>
        </div>
        <div class="chat-right" ref="cDianLiu">
          <UPlotChart v-if="dataArrc" :data="dataArrc" :seriesData="chartSeriesc" />
        </div>
      </div>
      <!-- 线电压Uab -->
      <div class="bom-chat-box" v-if="dianyaUab">
        <div class="chat-left">
          <div>线电压Uab</div>
          <div>Voltage(kV)</div>
        </div>
        <div class="chat-right" ref="dianyaUabRef">
          <UPlotChart v-if="dataArrUab" :data="dataArrUab" :seriesData="chartSeriesUab" />
        </div>
      </div>
      <!-- 线电压Ubc -->
      <div class="bom-chat-box" v-if="dianyaUbc">
        <div class="chat-left">
          <div>线电压Ubc</div>
          <div>Voltage(kV)</div>
        </div>
        <div class="chat-right" ref="dianyaUbcRef">
          <UPlotChart v-if="dataArrUbc" :data="dataArrUbc" :seriesData="chartSeriesUbc" />
        </div>
      </div>
      <!-- 线电压Uca -->
      <div class="bom-chat-box" v-if="dianyaUca">
        <div class="chat-left">
          <div>线电压Uca</div>
          <div>Voltage(kV)</div>
        </div>
        <div class="chat-right" ref="dianyaUcaRef">
          <UPlotChart v-if="dataArrUca" :data="dataArrUca" :seriesData="chartSeriesUca" />
        </div>
      </div>
      <!-- 相电压Ua -->
      <div class="bom-chat-box" v-if="dianyaUa">
        <div class="chat-left">
          <div>相电压Ua</div>
          <div>Voltage(kV)</div>
        </div>
        <div class="chat-right" ref="dianyaUaRef">
          <UPlotChart v-if="dataArrUa" :data="dataArrUa" :seriesData="chartSeriesUa" />
        </div>
      </div>
      <!-- 相电压Ub -->
      <div class="bom-chat-box" v-if="dianyaUb">
        <div class="chat-left">
          <div>相电压Ub</div>
          <div>Voltage(kV)</div>
        </div>
        <div class="chat-right" ref="dianyaUbRef">
          <UPlotChart v-if="dataArrUb" :data="dataArrUb" :seriesData="chartSeriesUb" />
        </div>
      </div>
      <!-- 相电压Uc -->
      <div class="bom-chat-box" v-if="dianyaUc">
        <div class="chat-left">
          <div>相电压Uc</div>
          <div>Voltage(kV)</div>
        </div>
        <div class="chat-right" ref="dianyaUcRef">
          <UPlotChart v-if="dataArrUc" :data="dataArrUc" :seriesData="chartSeriesUc" />
        </div>
      </div>
      <!-- 总视在功率 -->
      <div class="bom-chat-box" v-if="isSPowerAll">
        <div class="chat-left">
          <div>总视在功率</div>
          <div>Power(kVA)</div>
        </div>
        <div class="chat-right" ref="refsPowerAll">
          <UPlotChart v-if="dataArrPowerAll" :data="dataArrPowerAll" :seriesData="chartSeriesPowerAll" />
        </div>
      </div>
      <!-- A相视在功率 -->
      <div class="bom-chat-box" v-if="isSPowerA">
        <div class="chat-left">
          <div>A相视在功率</div>
          <div>Power(kVA)</div>
        </div>
        <div class="chat-right" ref="refsPowerA">
          <UPlotChart v-if="dataArrsPowerA" :data="dataArrsPowerA" :seriesData="chartSeriessPowerA" />
        </div>
      </div>
      <!-- B相视在功率sPowerB -->
      <div class="bom-chat-box" v-if="isSPowerB">
        <div class="chat-left">
          <div>B相视在功率</div>
          <div>Power(kVA)</div>
        </div>
        <div class="chat-right" ref="refsPowerB">
          <UPlotChart v-if="dataArrsPowerB" :data="dataArrsPowerB" :seriesData="chartSeriessPowerB" />
        </div>
      </div>
      <!-- C相视在功率sPowerC -->
      <div class="bom-chat-box" v-if="isSPowerC">
        <div class="chat-left">
          <div>C相视在功率</div>
          <div>Power(kVA)</div>
        </div>
        <div class="chat-right" ref="refsPowerC">
          <UPlotChart v-if="dataArrsPowerC" :data="dataArrsPowerC" :seriesData="chartSeriessPowerC" />
        </div>
      </div>
      <!-- 总有功功率 -->
      <div class="bom-chat-box" v-if="isPPowerAll">
        <div class="chat-left">
          <div>总有功功率</div>
          <div>Power(kW)</div>
        </div>
        <div class="chat-right" ref="refsPPowerAll">
          <UPlotChart v-if="dataArrPPowerAll" :data="dataArrPPowerAll" :seriesData="chartSeriesPPowerAll" />
        </div>
      </div>
      <!-- A相有功功率 -->
      <div class="bom-chat-box" v-if="isPPowerA">
        <div class="chat-left">
          <div>A相有功功率</div>
          <div>Power(kW)</div>
        </div>
        <div class="chat-right" ref="refsPPowerA">
          <UPlotChart v-if="dataArrPPowerA" :data="dataArrPPowerA" :seriesData="chartSeriesPPowerA" />
        </div>
      </div>
      <!-- B相有功功率 -->
      <div class="bom-chat-box" v-if="isPPowerB">
        <div class="chat-left">
          <div>B相有功功率</div>
          <div>Power(kW)</div>
        </div>
        <div class="chat-right" ref="refsPPowerB">
          <UPlotChart v-if="dataArrPPowerB" :data="dataArrPPowerB" :seriesData="chartSeriesPPowerB" />
        </div>
      </div>
      <!-- C相有功功率 -->
      <div class="bom-chat-box" v-if="isPPowerC">
        <div class="chat-left">
          <div>C相有功功率</div>
          <div>Power(kW)</div>
        </div>
        <div class="chat-right" ref="refsPPowerC">
          <UPlotChart v-if="dataArrPPowerC" :data="dataArrPPowerC" :seriesData="chartSeriesPPowerC" />
        </div>
      </div>
      <!-- 总无功功率qPowerAll -->
      <div class="bom-chat-box" v-if="isQPowerAll">
        <div class="chat-left">
          <div>总无功功率</div>
          <div>Power(kvar)</div>
        </div>
        <div class="chat-right" ref="refsQPowerAll">
          <UPlotChart v-if="dataArrQPowerAll" :data="dataArrQPowerAll" :seriesData="chartSeriesQPowerAll" />
        </div>
      </div>
      <!-- A相无功功率qPowerA -->
      <div class="bom-chat-box" v-if="isQPowerA">
        <div class="chat-left">
          <div>A相无功功率</div>
          <div>Voltage(kvar)</div>
        </div>
        <div class="chat-right" ref="refsQPowerA">
          <UPlotChart v-if="dataArrQPowerA" :data="dataArrQPowerA" :seriesData="chartSeriesQPowerA" />
        </div>
      </div>
      <!-- B相无功功率qPowerB -->
      <div class="bom-chat-box" v-if="isQPowerB">
        <div class="chat-left">
          <div>B相无功功率</div>
          <div>Voltage(kvar)</div>
        </div>
        <div class="chat-right" ref="refsQPowerB">
          <UPlotChart v-if="dataArrQPowerB" :data="dataArrQPowerB" :seriesData="chartSeriesQPowerB" />
        </div>
      </div>
      <!-- C相无功功率qPowerC -->
      <div class="bom-chat-box" v-if="isQPowerC">
        <div class="chat-left">
          <div>C相无功功率</div>
          <div>Voltage(kvar)</div>
        </div>
        <div class="chat-right" ref="refsQPowerC">
          <UPlotChart v-if="dataArrQPowerC" :data="dataArrQPowerC" :seriesData="chartSeriesQPowerC" />
        </div>
      </div>
      <!-- A相功率因数 -->
      <div class="bom-chat-box" v-if="isCosphiA">
        <div class="chat-left">
          <div>A相功率因数</div>
          <div>PowerFactor</div>
        </div>
        <div class="chat-right" ref="refsCosphiA">
          <UPlotChart v-if="dataArrCosphiA" :data="dataArrCosphiA" :seriesData="chartSeriesCosphiA" />
        </div>
      </div>
      <!-- B相功率因数 -->
      <div class="bom-chat-box" v-if="isCosphiB">
        <div class="chat-left">
          <div>B相功率因数</div>
          <div>PowerFactor</div>
        </div>
        <div class="chat-right" ref="refsCosphiB">
          <UPlotChart v-if="dataArrCosphiB" :data="dataArrCosphiB" :seriesData="chartSeriesCosphiB" />
        </div>
      </div>
      <!-- C相功率因数 -->
      <div class="bom-chat-box" v-if="isCosphiC">
        <div class="chat-left">
          <div>C相功率因数</div>
          <div>PowerFactor</div>
        </div>
        <div class="chat-right" ref="refsCosphiC">
          <UPlotChart v-if="dataArrCosphiC" :data="dataArrCosphiC" :seriesData="chartSeriesCosphiC" />
        </div>
      </div>
      <!-- A相无功需量qDemandAll -->
      <div class="bom-chat-box" v-if="isQDemandA">
        <div class="chat-left">
          <div>A相无功需量</div>
          <div>Demand(Var)</div>
        </div>
        <div class="chat-right" ref="refsQDemandA">
          <UPlotChart v-if="dataArrQDemandA" :data="dataArrQDemandA" :seriesData="chartSeriesQDemandA" />
        </div>
      </div>
      <!-- B相无功需量qDemandA -->
      <div class="bom-chat-box" v-if="isQDemandB">
        <div class="chat-left">
          <div>B相无功需量</div>
          <div>Demand(Var)</div>
        </div>
        <div class="chat-right" ref="refsQDemandB">
          <UPlotChart v-if="dataArrQDemandB" :data="dataArrQDemandB" :seriesData="chartSeriesQDemandB" />
        </div>
      </div>
      <!-- C相无功需量qDemandC -->
      <div class="bom-chat-box" v-if="isQDemandC">
        <div class="chat-left">
          <div>C相无功需量</div>
          <div>Demand(Var)</div>
        </div>
        <div class="chat-right" ref="refsQDemandC">
          <UPlotChart v-if="dataArrQDemandC" :data="dataArrQDemandC" :seriesData="chartSeriesQDemandC" />
        </div>
      </div>

      <!-- 视在电度 -->
      <div class="bom-chat-box" v-if="isSEDegree">
        <div class="chat-left">
          <div>视在电度</div>
          <div>Electrical(kWh)</div>
        </div>
        <div class="chat-right" ref="refsSEDegree">
          <UPlotChart v-if="dataArrSEDegree" :data="dataArrSEDegree" :seriesData="chartSeriesSEDegree" />
        </div>
      </div>
      <!-- 有功电度 -->
      <div class="bom-chat-box" v-if="isPEDegree">
        <div class="chat-left">
          <div>有功电度</div>
          <div>Electrical(kWh)</div>
        </div>
        <div class="chat-right" ref="refsPEDegree">
          <UPlotChart v-if="dataArrPEDegree" :data="dataArrPEDegree" :seriesData="chartSeriesPEDegree" />
        </div>
      </div>
      <!-- 无功电度 -->
      <div class="bom-chat-box" v-if="isQEDegree">
        <div class="chat-left">
          <div>无功电度</div>
          <div>Electrical(kWh)</div>
        </div>
        <div class="chat-right" ref="refsQEDegree">
          <UPlotChart v-if="dataArrQEDegree" :data="dataArrQEDegree" :seriesData="chartSeriesQEDegree" />
        </div>
      </div>
      <!-- A相电压谐波总含量 -->
      <div class="bom-chat-box" v-if="isTHDVa">
        <div class="chat-left">
          <div>A相电压谐波总含量</div>
          <div>Voltage(kV)</div>
        </div>
        <div class="chat-right" ref="refsTHDVa">
          <UPlotChart v-if="dataArrTHDVa" :data="dataArrTHDVa" :seriesData="chartSeriesTHDVa" />
        </div>
      </div>
      <!-- B相电压谐波总含量 -->
      <div class="bom-chat-box" v-if="isTHDVb">
        <div class="chat-left">
          <div>B相电压谐波总含量</div>
          <div>Voltage(kV)</div>
        </div>
        <div class="chat-right" ref="refsTHDVb">
          <UPlotChart v-if="dataArrTHDVb" :data="dataArrTHDVb" :seriesData="chartSeriesTHDVb" />
        </div>
      </div>
      <!-- C相电压谐波总含量 -->
      <div class="bom-chat-box" v-if="isTHDVc">
        <div class="chat-left">
          <div>C相电压谐波总含量</div>
          <div>Voltage(kV)</div>
        </div>
        <div class="chat-right" ref="refsTHDVc">
          <UPlotChart v-if="dataArrTHDVc" :data="dataArrTHDVc" :seriesData="chartSeriesTHDVc" />
        </div>
      </div>
      <!-- A相电流谐波总含量 -->
      <div class="bom-chat-box" v-if="isTHDIa">
        <div class="chat-left">
          <div>A相电流谐波总含量</div>
          <div>Voltage(kV)</div>
        </div>
        <div class="chat-right" ref="refsTHDIa">
          <UPlotChart v-if="dataArrTHDIa" :data="dataArrTHDIa" :seriesData="chartSeriesTHDIa" />
        </div>
      </div>
      <!-- B相电流谐波总含量 -->
      <div class="bom-chat-box" v-if="isTHDIb">
        <div class="chat-left">
          <div>B相电流谐波总含量</div>
          <div>Voltage(kV)</div>
        </div>
        <div class="chat-right" ref="refsTHDIb">
          <UPlotChart v-if="dataArrTHDIb" :data="dataArrTHDIb" :seriesData="chartSeriesTHDIb" />
        </div>
      </div>
      <!-- C相电流谐波总含量 -->
      <div class="bom-chat-box" v-if="isTHDIc">
        <div class="chat-left">
          <div>C相电流谐波总含量</div>
          <div>Voltage(kV)</div>
        </div>
        <div class="chat-right" ref="refsTHDIc">
          <UPlotChart v-if="dataArrTHDIc" :data="dataArrTHDIc" :seriesData="chartSeriesTHDIc" />
        </div>
      </div>


      <!-- 电缆室局放（超声波）趋势 -->
      <div class="bom-chat-box" v-if="isdianlanjufang">
        <div class="chat-left">
          <div>电缆室-局放趋势</div>
          <div>Ultrasound(Hz)</div>
        </div>
        <div class="chat-right" ref="refsdianlanjufang">
          <UPlotChart v-if="dianlanArrjufang" :data="dianlanArrjufang" :seriesData="chartSeriesdianlanjufang" />
        </div>
      </div>
      <!-- 母线室局放（超声波）趋势 -->
      <div class="bom-chat-box" v-if="ismuxianjufang">
        <div class="chat-left">
          <div>母线室-局放趋势</div>
          <div>Ultrasound(Hz)</div>
        </div>
        <div class="chat-right" ref="refsmuxianjufang">
          <UPlotChart v-if="muxianArrjufang" :data="muxianArrjufang" :seriesData="chartSeriesmuxianjufang" />
        </div>
      </div>
      <!-- 断路器室局放（超声波）趋势 -->
      <div class="bom-chat-box" v-if="isduanluqijufang">
        <div class="chat-left">
          <div>断路器室-局放趋势</div>
          <div>Ultrasound(Hz)</div>
        </div>
        <div class="chat-right" ref="refsduanluqijufang">
          <UPlotChart v-if="duanluqiArrjufang" :data="duanluqiArrjufang" :seriesData="chartSeriesduanluqijufang" />
        </div>
      </div>


      <!-- 电缆室弧光（紫外线）趋势 -->
      <div class="bom-chat-box" v-if="isdianlanhuguang">
        <div class="chat-left">
          <div>电缆室-弧光趋势</div>
          <div>Ultraviolet(UV)</div>
        </div>
        <div class="chat-right" ref="refsdianlanshihuguang">
          <UPlotChart v-if="dianlanArrhuguang" :data="dianlanArrhuguang" :seriesData="chartSeriesdianlanhuguang" />
        </div>
      </div>
      <!-- 母线室弧光（紫外线）趋势 -->
      <div class="bom-chat-box" v-if="ismuxianhuguang">
        <div class="chat-left">
          <div>母线室-弧光趋势</div>
          <div>Ultraviolet(UV)</div>
        </div>
        <div class="chat-right" ref="refsmuxianshihuguang">
          <UPlotChart v-if="muxianArrhuguang" :data="muxianArrhuguang" :seriesData="chartSeriesmuxianhuguang" />
        </div>
      </div>
      <!-- 断路器室弧光（紫外线）趋势 -->
      <div class="bom-chat-box" v-if="isduanluqihuguang">
        <div class="chat-left">
          <div>断路器室-弧光趋势</div>
          <div>Ultraviolet(UV)</div>
        </div>
        <div class="chat-right" ref="refsduanluqihuguang">
          <UPlotChart v-if="duanluqiArrhuguang" :data="duanluqiArrhuguang" :seriesData="chartSeriesduanluqihuguang" />
        </div>
      </div>

      <!-- 电缆室烟气（0.3）趋势 -->
      <div class="bom-chat-box" v-if="isdianlansmoke3">
        <div class="chat-left">
          <div>电缆室-烟气（0.3）</div>
          <div>Smoke</div>
        </div>
        <div class="chat-right" ref="refsdianlansmoke3">
          <UPlotChart v-if="dianlanArrsmoke3" :data="dianlanArrsmoke3" :seriesData="chartSeriesdianlansmoke3" />
        </div>
      </div>
      <!-- 母线室烟气（0.3）趋势 -->
      <div class="bom-chat-box" v-if="ismuxiansmoke3">
        <div class="chat-left">
          <div>母线室-烟气（0.3）</div>
          <div>Smoke</div>
        </div>
        <div class="chat-right" ref="refsmuxiansmoke3">
          <UPlotChart v-if="muxianArrsmoke3" :data="muxianArrsmoke3" :seriesData="chartSeriesmuxiansmoke3" />
        </div>
      </div>
      <!-- 断路器室烟气（0.3）趋势 -->
      <div class="bom-chat-box" v-if="isduanluqismoke3">
        <div class="chat-left">
          <div>断路器室-烟气（0.3）</div>
          <div>Smoke</div>
        </div>
        <div class="chat-right" ref="refsduanluqismoke3">
          <UPlotChart v-if="duanluqiArrsmoke3" :data="duanluqiArrsmoke3" :seriesData="chartSeriesduanluqismoke3" />
        </div>
      </div>
      <!-- 电缆室烟气（0.5）趋势 -->
      <div class="bom-chat-box" v-if="isdianlansmoke5">
        <div class="chat-left">
          <div>电缆室-烟气（0.5）</div>
          <div>Smoke</div>
        </div>
        <div class="chat-right" ref="refsdianlansmoke5">
          <UPlotChart v-if="dianlanArrsmoke5" :data="dianlanArrsmoke5" :seriesData="chartSeriesdianlansmoke5" />
        </div>
      </div>
      <!-- 母线室烟气（0.5）趋势 -->
      <div class="bom-chat-box" v-if="ismuxiansmoke5">
        <div class="chat-left">
          <div>母线室-烟气（0.5）</div>
          <div>Smoke</div>
        </div>
        <div class="chat-right" ref="refsmuxiansmoke5">
          <UPlotChart v-if="muxianArrsmoke5" :data="muxianArrsmoke5" :seriesData="chartSeriesmuxiansmoke5" />
        </div>
      </div>
      <!-- 断路器室烟气（0.5）趋势 -->
      <div class="bom-chat-box" v-if="isduanluqismoke5">
        <div class="chat-left">
          <div>断路器室-烟气（0.5）</div>
          <div>Smoke</div>
        </div>
        <div class="chat-right" ref="refsduanluqismoke5">
          <UPlotChart v-if="duanluqiArrsmoke5" :data="duanluqiArrsmoke5" :seriesData="chartSeriesduanluqismoke5" />
        </div>
      </div>
      <!-- 电缆室烟气（1）趋势 -->
      <div class="bom-chat-box" v-if="isdianlansmoke10">
        <div class="chat-left">
          <div>电缆室-烟气（1）</div>
          <div>Smoke</div>
        </div>
        <div class="chat-right" ref="refsdianlansmoke10">
          <UPlotChart v-if="dianlanArrsmoke10" :data="dianlanArrsmoke10" :seriesData="chartSeriesdianlansmoke10" />
        </div>
      </div>
      <!-- 母线室烟气（1）趋势 -->
      <div class="bom-chat-box" v-if="ismuxiansmoke10">
        <div class="chat-left">
          <div>母线室-烟气（1）</div>
          <div>Smoke</div>
        </div>
        <div class="chat-right" ref="refsmuxiansmoke10">
          <UPlotChart v-if="muxianArrsmoke10" :data="muxianArrsmoke10" :seriesData="chartSeriesmuxiansmoke10" />
        </div>
      </div>
      <!-- 断路器室烟气（1）趋势 -->
      <div class="bom-chat-box" v-if="isduanluqismoke10">
        <div class="chat-left">
          <div>断路器室-烟气（1）</div>
          <div>Smoke</div>
        </div>
        <div class="chat-right" ref="refsduanluqismoke10">
          <UPlotChart v-if="duanluqiArrsmoke10" :data="duanluqiArrsmoke10" :seriesData="chartSeriesduanluqismoke10" />
        </div>
      </div>
      <!-- 电缆室烟气（2.5）趋势 -->
      <div class="bom-chat-box" v-if="isdianlansmoke25">
        <div class="chat-left">
          <div>电缆室-烟气（2.5）</div>
          <div>Smoke</div>
        </div>
        <div class="chat-right" ref="refsdianlansmoke25">
          <UPlotChart v-if="dianlanArrsmoke25" :data="dianlanArrsmoke25" :seriesData="chartSeriesdianlansmoke25" />
        </div>
      </div>
      <!-- 母线室烟气（2.5）趋势 -->
      <div class="bom-chat-box" v-if="ismuxiansmoke25">
        <div class="chat-left">
          <div>母线室-烟气（2.5）</div>
          <div>Smoke</div>
        </div>
        <div class="chat-right" ref="refsmuxiansmoke25">
          <UPlotChart v-if="muxianArrsmoke25" :data="muxianArrsmoke25" :seriesData="chartSeriesmuxiansmoke25" />
        </div>
      </div>
      <!-- 断路器室烟气（2.5）趋势 -->
      <div class="bom-chat-box" v-if="isduanluqismoke25">
        <div class="chat-left">
          <div>断路器室-烟气（2.5）</div>
          <div>Smoke</div>
        </div>
        <div class="chat-right" ref="refsduanluqismoke25">
          <UPlotChart v-if="duanluqiArrsmoke25" :data="duanluqiArrsmoke25" :seriesData="chartSeriesduanluqismoke25" />
        </div>
      </div>
      <!-- 电缆室烟气（5）趋势 -->
      <div class="bom-chat-box" v-if="isdianlansmoke50">
        <div class="chat-left">
          <div>电缆室-烟气（5）</div>
          <div>Smoke</div>
        </div>
        <div class="chat-right" ref="refsdianlansmoke50">
          <UPlotChart v-if="dianlanArrsmoke50" :data="dianlanArrsmoke50" :seriesData="chartSeriesdianlansmoke50" />
        </div>
      </div>
      <!-- 母线室烟气（5）趋势 -->
      <div class="bom-chat-box" v-if="ismuxiansmoke50">
        <div class="chat-left">
          <div>母线室-烟气（5）</div>
          <div>Smoke</div>
        </div>
        <div class="chat-right" ref="refsmuxiansmoke50">
          <UPlotChart v-if="muxianArrsmoke50" :data="muxianArrsmoke50" :seriesData="chartSeriesmuxiansmoke50" />
        </div>
      </div>
      <!-- 断路器室烟气（5）趋势 -->
      <div class="bom-chat-box" v-if="isduanluqismoke50">
        <div class="chat-left">
          <div>断路器室-烟气（5）</div>
          <div>Smoke</div>
        </div>
        <div class="chat-right" ref="refsduanluqismoke50">
          <UPlotChart v-if="duanluqiArrsmoke50" :data="duanluqiArrsmoke50" :seriesData="chartSeriesduanluqismoke50" />
        </div>
      </div>
      <!-- 电缆室烟气（10）趋势 -->
      <div class="bom-chat-box" v-if="isdianlansmoke100">
        <div class="chat-left">
          <div>电缆室-烟气（10）</div>
          <div>Smoke</div>
        </div>
        <div class="chat-right" ref="refsdianlansmoke100">
          <UPlotChart v-if="dianlanArrsmoke100" :data="dianlanArrsmoke100" :seriesData="chartSeriesdianlansmoke100" />
        </div>
      </div>
      <!-- 母线室烟气（10）趋势 -->
      <div class="bom-chat-box" v-if="ismuxiansmoke100">
        <div class="chat-left">
          <div>母线室-烟气（10）</div>
          <div>Smoke</div>
        </div>
        <div class="chat-right" ref="refsmuxiansmoke100">
          <UPlotChart v-if="muxianArrsmoke100" :data="muxianArrsmoke100" :seriesData="chartSeriesmuxiansmoke100" />
        </div>
      </div>
      <!-- 断路器室烟气（10）趋势 -->
      <div class="bom-chat-box" v-if="isduanluqismoke100">
        <div class="chat-left">
          <div>断路器室-烟气（10）</div>
          <div>Smoke</div>
        </div>
        <div class="chat-right" ref="refsduanluqismoke100">
          <UPlotChart v-if="duanluqiArrsmoke100" :data="duanluqiArrsmoke100"
            :seriesData="chartSeriesduanluqismoke100" />
        </div>
      </div>


      <!-- 电缆室红外光最大温度 -->
      <div class="bom-chat-box" v-if="isdianlanMaxTemp">
        <div class="chat-left">
          <div>电缆室红外光最大温度</div>
          <div>Temperature(°C)</div>
        </div>
        <div class="chat-right" ref="refsdianlanMaxTemp">
          <UPlotChart v-if="dianlanmaxArrwen_du" :data="dianlanmaxArrwen_du"
            :seriesData="chartSeriesdianlanmaxwen_du" />
        </div>
      </div>
      <!-- 母线室红外光最大温度 -->
      <div class="bom-chat-box" v-if="ismuxianMaxTemp">
        <div class="chat-left">
          <div>母线室红外光最大温度</div>
          <div>Temperature(°C)</div>
        </div>
        <div class="chat-right" ref="refsmuxianMaxTemp">
          <UPlotChart v-if="muxianmaxArrwen_du" :data="muxianmaxArrwen_du" :seriesData="chartSeriesmuxianmaxwen_du" />
        </div>
      </div>
      <!-- 断路器室红外光最大温度 -->
      <div class="bom-chat-box" v-if="isduanluqiMaxTemp">
        <div class="chat-left">
          <div>断路器室红外光最大温度</div>
          <div>Temperature(°C)</div>
        </div>
        <div class="chat-right" ref="refsduanluqiMaxTemp">
          <UPlotChart v-if="duanluqimaxArrwen_du" :data="duanluqimaxArrwen_du"
            :seriesData="chartSeriesduanluqimaxwen_du" />
        </div>
      </div>


      <!-- 电缆室-环境温度 -->
      <div class="bom-chat-box" v-if="iswen_du">
        <div class="chat-left">
          <div>电缆室-环境温度</div>
          <div>Temperature(°C)</div>
        </div>
        <div class="chat-right" ref="refswen_du">
          <UPlotChart v-if="dataArrwen_du" :data="dataArrwen_du" :seriesData="chartSerieswen_du" />
        </div>
      </div>
      <!-- 电缆室-环境湿度 -->
      <div class="bom-chat-box" v-if="isshi_du">
        <div class="chat-left">
          <div>电缆室-环境湿度</div>
          <div>Humidity(%)</div>
        </div>
        <div class="chat-right" ref="refsshi_du">
          <UPlotChart v-if="dataArrshi_du" :data="dataArrshi_du" :seriesData="chartSeriesshi_du" />
        </div>
      </div>

      <!-- 母线室-环境温度 -->
      <div class="bom-chat-box" v-if="iswen_dumuxian">
        <div class="chat-left">
          <div>母线室-环境温度</div>
          <div>Temperature(°C)</div>
        </div>
        <div class="chat-right" ref="refsmuxianwen_du">
          <UPlotChart v-if="muxianArrwen_du" :data="muxianArrwen_du" :seriesData="chartSeriesmuxianwen_du" />
        </div>
      </div>
      <!-- 母线室-环境湿度 -->
      <div class="bom-chat-box" v-if="isshi_dumuxian">
        <div class="chat-left">
          <div>母线室-环境湿度</div>
          <div>Humidity(%)</div>
        </div>
        <div class="chat-right" ref="refsmuxianshi_du">
          <UPlotChart v-if="muxianArrshi_du" :data="muxianArrshi_du" :seriesData="chartSeriesmuxianshi_du" />
        </div>
      </div>

      <!-- 断路器室-环境温度 -->
      <div class="bom-chat-box" v-if="iswen_duduanluqi">
        <div class="chat-left">
          <div>断路器室环境温度</div>
          <div>Temperature(°C)</div>
        </div>
        <div class="chat-right" ref="refsduanluwen_du">
          <UPlotChart v-if="duanluArrwen_du" :data="duanluArrwen_du" :seriesData="chartSeriesduanluwen_du" />
        </div>
      </div>
      <!-- 断路器室-环境湿度 -->
      <div class="bom-chat-box" v-if="isshi_duduanluqi">
        <div class="chat-left">
          <div>断路器室环境湿度</div>
          <div>Humidity(%)</div>
        </div>
        <div class="chat-right" ref="refsduanlushi_du">
          <UPlotChart v-if="duanluArrshi_du" :data="duanluArrshi_du" :seriesData="chartSeriesduanlushi_du" /> 
        </div>
      </div>
    </div>
  </div>
</template>

<style lang="scss" scoped>
@use "index";
</style>
